<template>
	<div class="hisEarlySelectWrap">
        <div class="hisSelectItem">
            <span class="itemName">区域：</span>
            <span class="itemCon">北京</span>
        </div>
        <div class="hisSelectItem">
            <span class="itemName">日期：</span>
            <span class="itemCon">2022-08-12</span>
        </div>
		<div class="hisSelectItem">
            <span class="itemName">灾害数据分类：</span>
            <span class="itemCon">暴雨等级</span>
        </div>
		<div class="hisSelectItemKey">
            <div class="itemKeyName">要素：</div>
			<div class="itemKeyPart">
				<div class="itemKeyPartTit"><span>常规气象灾害</span></div>
				<van-radio-group v-model="radio">
					<van-radio v-for='(item,index) in normalKey' :key="index" :name="index">{{item}}</van-radio>
				</van-radio-group>
			</div>
			<div class="itemKeyPart">
				<div class="itemKeyPartTit"><span>环境气象灾害</span></div>
				<van-radio-group v-model="radio">
					<van-radio v-for='(item,index) in envKey' :key="index" :name="index + 100">{{item}}</van-radio>
				</van-radio-group>
			</div>
			<div class="itemKeyPart">
				<div class="itemKeyPartTit"><span>电线积冰灾害</span></div>
				<van-radio-group v-model="radio">
					<van-radio v-for='(item,index) in iceKey' :key="index" :name="index + 200">{{item}}</van-radio>
				</van-radio-group>
			</div>
        </div>
		<div class="btnArea">
			<van-button @click="cancelBtn" type="default">取消</van-button>
			<van-button @click="confrimBtn" type="primary">确认</van-button>
		</div>
	</div>
</template>
<script type="text/javascript">
	export default{
		data () {
			return {
				index:0,
				result: [],
				radio:"",
				normalKey:['资料时间','平均气压','平均2分钟风速','平均气温','最高气温','最高气温出现时间','最低气温','最低气温出现时间','平均相对湿度','20-20时降水量','08-08时降水量','20-08时降水量','08-20时降水量'],
				envKey:['露','霜','结冰','烟','霾','浮尘'],
				iceKey:['南北方向厚度','东西方向厚度','南北方向重量','东西方向重量','南北方向直径','东西方向直径']

			}
		},
		mounted (){

        },
        watch:{
            
        },
		components : {
			
		},
		methods : {
			onClickLeft(){
				this.$router.go(-1);
			},
			cancelBtn(){
				this.$emit("cancel")
			},
			confrimBtn(){
				this.$emit("confrim")
			}
		}
	}
</script>
<style type="text/css" lang="less">
	.hisEarlySelectWrap{
		.hisSelectItem{
			padding:25px 10px 0;
			font-size:16px;
		}
		.itemName{
			color:#999;
		}
		.hisSelectItemKey{
			padding:25px 10px 0;
			color:#999;
		}
		.itemKeyPart{
			padding-top: 15px;
		}
		.itemKeyPartTit{
			padding-bottom: 15px;
			font-size: 12px;
			color: #333;
		}
		.van-radio{
			margin-right: 32px;
    		margin-bottom: 20px;
		}
		.btnArea{
			text-align: center;
			margin-top: 10px;
			margin-bottom: 10px;
		}
		.van-button--normal{
			width: 40%;
		}
		.van-button--normal:first-child{
			margin-right: 10px;
		}
    }
</style>